<script setup>
import { useRoute,useRouter } from 'vue-router';
import { ElMessage,ElMessageBox  } from 'element-plus';
import { getVerifyList } from '@/api/Member/index.js';
import { GMTToStr } from '@/utils/common.js'
const props = defineProps({
    uuid:{
        default:"",
        type:[String,Number]
    }
})

const seachTable = ref(null);
const route = useRoute();
const router = useRouter();
const instance = getCurrentInstance();
//日期选择器暂存的时间日期，限制范围使用
const checkDateRange = ref([])
// 新增编辑回退时候刷新列表
onActivated(()=>{

})

const formInline = ref([
    {
      type: "datePicker",
      prop: ["startDate", "endDate"],
      startPlaceholder: "开始时间",
      endPlaceholder: "结束时间",
      label: "",
      model:["",""],
      editDateValue:(value)=>{
        checkDateRange.value = [];
      },
      changeDateValue:(value)=>{
        checkDateRange.value = value;
      },
      disabledDate:(time)=>{
        let dateRange = checkDateRange.value;
        if((dateRange[0]??'') === ''){
          return false;
        }
        let startTimeValue = new Date(dateRange[0]).getTime();
        let endTimeValue = new Date(dateRange[0]);
        endTimeValue.setFullYear(endTimeValue.getFullYear() + 1);
        endTimeValue = endTimeValue.getTime();
        return time.getTime() < startTimeValue || time.getTime() > endTimeValue;
      }
    },
    {
      type: "input",
      prop: "verifyNo",
      placeholder: "核销单号",
      label: "",
      model: "",
    },
    {
      type: "input",
      prop: "orderNo",
      placeholder: "销售单号",
      label: "",
      model: "",
    },
])

const btnLefts = ref([
])
const btnRights = ref([
])

const tableConfig = ref([
    {
      prop: "verifyNo",
      label: "核销单号",
      width:150
    },
    {
      prop: "orderNo",
      label: "销售单号",
      type:"slot",
      slotName:"orderNo",
      width:150
    },
    {
      prop: "itemName",
      label: "项目/疗程名称",
      width:200
    },
    {
      prop: "storeName",
      label: "购买门店",
      width:200
    },
    {
      prop: "useNum",
      label: "购买次数",
      width:100
    },
    {
      prop: "verifyNum",
      label: "核销数量",
      width:100
    },
    // {
    //   prop: "verifyAmount",
    //   label: "单次核销金额",
    //   width:150
    // },
    {
      prop: "verifyAllAmount",
      label: "核销总额",
      width:100
    },
    {
      prop: "verifyStatus",
      label: "核销状态",
      width:100,
      format:(value)=>{
        return ["已提交","已完成","已取消"][value]
      }
    },
    {
      prop: "verifyName",
      label: "执行人",
      width:150
    },
    {
      prop: "createName",
      label: "创建人",
      width:150
    },
    {
      prop: "verifyTime",
      label: "核销时间",
      width:250
    },
    {
      prop: "createTime",
      label: "提交时间",
      width:250
    },
]);
const tableLoading = ref(false)
const totalPage = ref(0)
const tableData = ref([]);


const handlerSearch = async (formInline)=>{
    tableLoading.value = true;
    try{
        let params = {
            ...formInline,
            memberId:props.uuid
        };
        if((params.startDate??'') !== ''){
          params.startDate =params.startDate.split(" ")[0]; 
        }
        if((params.endDate??'') !== ''){
          params.endDate =params.endDate.split(" ")[0]; 
        }
        let result = await getVerifyList(params);
        console.log(result,222);
        totalPage.value = Number(result.total);
        tableData.value = result.records;
        tableLoading.value = false;
    }catch(e){
        tableLoading.value = false;
    }
}
const _setDefalutDate = ()=>{
  let nowDate = new Date();  
  let startDate = nowDate.valueOf() - 30 * 24 * 3600 * 1000;
  startDate = GMTToStr(startDate);
  let endDate = nowDate;
  endDate = GMTToStr(endDate);
  formInline.value[0].model = [startDate,endDate];;
}
_setDefalutDate();
</script>
<template>
    <div class="page-content">
        <SeachTable 
          :tableType="1"
          ref="seachTable"
          :forms="formInline"
          :btnLefts="btnLefts"
          :btnRights="btnRights"
          :tableLoading="tableLoading"
          :tableConfig="tableConfig"
          :tableData="tableData"
          :totalPage="totalPage"
          @handlerSearch="handlerSearch"
          :showLine="false"
          :showBtn="false"
        >
            <template #orderNo="{ row }">
                <div class="a-link">{{ row.orderNo }}</div>
            </template>
        </SeachTable>
    </div>
</template>
<style lang="less" scoped>
.a-link{
    color:#3480FF;
    font-size: 14px;
    cursor: pointer;
}
:deep(.search-line){
    padding:0;
}
:deep(.search-table .table){
    padding:0;
}
.text-info{
    width: 100%;
    font-size: 14px;
    font-weight: 400;
    line-height: 14px;
    color: #222222;
}
</style>